﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script type="text/javascript" src="00.jquery-2.0.3.js"></script>
</head>
<body>
    <input type="text" id="myInput" value="123"  class="class1 class2 "/>

    <script type="text/javascript">
        $(function () {
            var myInput = $("#myInput")[0];
            //1.boolHook: ^(?:checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped)$
            $.attr(myInput, "disabled", "123");
            $.attr(myInput, "readonly", "123");

            //2.attrHook  把input的type 设置成radio时。 解决浏览器的兼容性
            $.attr(myInput, "type", "radio");

            //3.其他的匹配nodeHook
            $.attr(myInput, "oid", "123");

            //4.设置一个html属性
            $("#myInput").attr("kczArea", "123");

            //5.设置多个html属性
            $("#myInput").attr({
                "area": "123",
                "oid": "123"
            });

            //6.获得属性值 
            $("#myInput").attr("area");
            
            $("#myInput").addClass("class3 class4");
            $("#myInput").remove("class3 class4");
            $("#myInput").toggleClass();
        });
    </script>
</body>
</html>
